<template>
  <div class="self-wrapper">
    <!-- 商家自我诊断 -->
    <top :configData="configData" @changeStatus="status => showChart = status" @changeStation="changeStation"></top>
    <!-- 诊断分析 -->
    <ni-panel :titleArr="['商家自我诊断分析评分','近30天']" v-if="showChart">
      <!-- 雷达图 -->
      <radar class="echart-radar-box" :gasId="gasId"></radar>
      <!-- 描述 -->
      <case img="description-diagnose.png" style="margin-bottom:48px"></case>
      <!-- 经营建议 -->
      <suggest></suggest>
    </ni-panel>
    <!-- 诊断案例 -->
    <ni-panel :titleArr="['诊断案例']">
      <case img="case.png"></case>
    </ni-panel>
  </div>
</template>
<script>
import initMix from './mixins/init'
import Radar from './components/echarts/radar'
export default {
  name:'intelligence_selfDiagnose',
  mixins:[initMix],
  components:{
    Radar
  },
  data(){
    return {
      configData: {
        title: '商家自我诊断',
        imgUrl: 'tips-diagnose.png',
        btnName: '诊断'
      },
      showChart: false, // 是否显示图表
      gasId: ''
    }
  },
  methods:{
    // 油站变化
    changeStation(gasId) {
      console.log(gasId)
      this.gasId = gasId
    }
  }
}
</script>
<style lang="less" scoped>
.self-wrapper{
  background: #ffffff;
  padding: 0 50px 30px;
  .echart-radar-box{
    margin-top: 30px;
  }
}
</style>